import { createApp } from 'vue'
import App from './App.vue'
import router from './router'
import { createPinia } from 'pinia'
import ElementPlus from 'element-plus'
import 'element-plus/dist/index.css'
import './assets/styles/main.css'
import * as ElementPlusIconsVue from '@element-plus/icons-vue'
import TooltipDirective from './directives/tooltip'
import { handleInitialRoute } from './utils/router'
import i18n from './plugins/i18n' // 导入i18n插件
import { checkAuth } from './utils/auth' // 导入权限检查工具

// 语言存储键名
const STORAGE_KEY = 'APP_LANGUAGE'

// 检查语言设置
const storedLanguage = localStorage.getItem(STORAGE_KEY)
if (!storedLanguage) {
  // 如果没有设置语言，根据浏览器语言设置默认语言
  const browserLang = navigator.language.toLowerCase()
  const defaultLang = browserLang.includes('zh') ? 'zh' : 'en'
  localStorage.setItem(STORAGE_KEY, defaultLang)
}

// Element Plus语言配置
import zhCn from 'element-plus/es/locale/lang/zh-cn'
import en from 'element-plus/es/locale/lang/en'

// 创建Vue应用实例
const app = createApp(App)

// 添加全局混入，实现权限检查
app.mixin({
  beforeCreate() {
    // 获取当前组件的路由信息
    const { meta } = this.$route || {}
    
    // 检查当前路由是否需要登录验证
    // 只在组件首次创建时执行权限检查，而不是每次更新时
    if (meta && meta.requiresAuth !== false && !this.$options._authChecked) {
      // 标记该组件已经检查过权限，避免重复检查
      this.$options._authChecked = true
      
      // 仅在开发环境下输出日志
      if (process.env.NODE_ENV === 'development') {
      }
    }
  },
  
  // 提供全局方法，方便组件内检查权限
  methods: {
    $checkAuth(showMessage = true) {
      return checkAuth(showMessage)
    },
    $isTokenValid() {
      const { isTokenValid, clearAuthInfo } = require('./utils/auth')
      const valid = isTokenValid()
      if (!valid) {
        clearAuthInfo()
      }
      return valid
    }
  }
})

// 注册Pinia状态管理
const pinia = createPinia()
app.use(pinia)

// 注册i18n
app.use(i18n)

// 获取当前语言
const currentLang = localStorage.getItem(STORAGE_KEY) || 'zh'
// 设置页面语言
document.documentElement.setAttribute('lang', currentLang)

// 根据当前语言选择Element Plus的语言包
const elementLang = currentLang === 'en' ? en : zhCn

// 注册Element Plus
app.use(ElementPlus, {
  locale: elementLang,
  size: 'default'
})

// 注册Element Plus图标
for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
  app.component(key, component)
}

// 注册tooltip指令
app.use(TooltipDirective)

// 注册路由
app.use(router)

// 确保ElementPlus语言配置全局可用
app.config.globalProperties.$ELEMENT = {
  locale: elementLang
}

// 监听语言变化，动态更新Element Plus语言
document.addEventListener('language-changed', (event) => {
  if (event.detail && event.detail.lang) {
    const newLang = event.detail.lang
    
    // 保存至本地存储
    localStorage.setItem(STORAGE_KEY, newLang)
    
    // 更新ElementPlus语言
    app.config.globalProperties.$ELEMENT.locale = newLang === 'en' ? en : zhCn
    
    // 更新i18n语言
    i18n.global.locale.value = newLang
    
    // 更新标题
    document.title = newLang === 'en' ? 'Data Platform' : '数据平台'
  }
})

// 添加全局错误处理
app.config.errorHandler = (err, instance, info) => {
  // console.error('Vue应用错误:', err)
  // console.error('错误详情:', {
  //   message: err.message,
  //   stack: err.stack,
  //   component: instance?.$options?.name || '未知组件',
  //   info
  // })
}

// 捕获所有未处理的Promise拒绝
window.addEventListener('unhandledrejection', event => {
  // console.error('未处理的Promise拒绝:', event.reason)
})

// 设置性能优化选项
app.config.performance = false

// 简化全局路由异常处理
router.onError((error) => {
  // console.error('全局路由错误:', error);
  // 不进行任何自动重定向，避免导致循环跳转
})

// 简化初始路由跳转逻辑
const initialRoute = handleInitialRoute();
if (initialRoute) {
  setTimeout(() => {
    window.location.hash = initialRoute.path.startsWith('#') 
      ? initialRoute.path 
      : `#${initialRoute.path.startsWith('/') ? initialRoute.path : '/' + initialRoute.path}`;
  }, 100);
}

// 挂载应用
app.mount('#app')

// 移除加载指示器
setTimeout(() => {
  const loadingElement = document.querySelector('.app-loading');
  if (loadingElement) {
    loadingElement.style.display = 'none';
  }
}, 500); 